import 'package:lai_zhan/common/config/ExportConfig.dart';
import 'package:lai_zhan/common/model/courseResult/course_result.dart';
import 'package:lai_zhan/widget/FlexButton.dart';
import 'package:lai_zhan/widget/ShopItem.dart';
import 'package:lai_zhan/widget/CoachItem.dart';

class CoursePage extends StatefulWidget {
  CourseResult course;

  CoursePage({this.course});

  @override
  State<StatefulWidget> createState() {
    // TODO: implement createState
    return new _CoursePageState(course);
  }
}

class _CoursePageState extends State<CoursePage> {
  CourseResult course;

  _CoursePageState(this.course);

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return BaseScaffold(
      title: '课程详情',
      back: () {
        NavigatorUtil.goBack(context);
      },
      titleColor: Color(AppColors.white),
      body: new ListView(
        primary: false,
        children: <Widget>[
          _renderHeader(),
          new Padding(
            padding: EdgeInsets.only(left: 20, right: 20),
            child: new Column(
              children: <Widget>[
                _renderDescr(),
                _renderStatus(),
                _renderShop(),
                _renderCoach()
              ],
            ),
          ),
          new Padding(padding: EdgeInsets.all(30))
        ],
      ),
      bottomSheet: _renderBottomSheet(),
    );
  }

  _renderBottomSheet() {
    int limit = 20;
    int left = 9;
    var width = AppSize.ScreenWidth/2-20;
    var subWidth = width/limit*(limit-left);
    return new Material(
      elevation: 5,
      child: new Container(
          height: AppSize.getRealHeight(50),
          width: AppSize.ScreenWidth,
          color: Color(AppColors.lightWhite),
          child: new Center(
            child: new Row(
              mainAxisAlignment: MainAxisAlignment.spaceAround,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: <Widget>[
                new Column(crossAxisAlignment: CrossAxisAlignment.start,
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: <Widget>[
                    new Text('订阅 11/20',style: AppConstant.middleTextBold,),
                    new Padding(padding: EdgeInsets.all(3)),
                    new Stack(children: <Widget>[
                      new Container(width: width,
                        height: 6,
                        decoration: BoxDecoration(borderRadius: BorderRadius.circular(3),
                            color: Color(AppColors.black)
                        ),
                      ),
                      new Container(width: subWidth,
                        height: 6,
                        decoration: BoxDecoration(borderRadius: BorderRadius.circular(3),
                            color: Color(AppColors.orangeA700)
                        ),
                      ),
                    ],)
                  ],),
                new FlatButton(
                    padding: EdgeInsets.all(0),
                    onPressed: () {},
                    child: new Container(
                      decoration: BoxDecoration(color: Color(AppColors.primaryColor),
                        borderRadius: BorderRadius.circular(6)
                      ),
                      width: AppSize.ScreenWidth/2-20,
                      height: AppSize.getRealHeight(40),
                      child: new Center(
                        child: new Text(
                          '订阅',
                          style: AppConstant.largeTextWhiteBold,),),)),
              ],),
          ),
      ),
    );
  }

  _renderHeader() {
    return new Stack(
      overflow: Overflow.clip,
      children: <Widget>[
        new FadeInImage.assetNetwork(
          placeholder: Config.DEFALUT_COURSE_IMAGE,
          image: '',
          width: AppSize.ScreenWidth,
          height: 200,
          fit: BoxFit.cover,
        ),
        new Container(
          width: AppSize.ScreenWidth,
          height: 200,
          alignment: Alignment.bottomCenter,
          child: new Container(
            width: AppSize.ScreenWidth - 40,
            height: 60,
            decoration: BoxDecoration(
                color: Color(AppColors.lightWhite),
                borderRadius: BorderRadius.only(
                    topLeft: Radius.circular(10.0),
                    topRight: Radius.circular(10.0))),
            child: new Center(
              child: new Text(
                '锻炼',
                style: new TextStyle(
                    fontFamily: "font1", fontSize: AppSize.getRealSp(40.0)),
              ),
            ),
          ),
        ),
      ],
    );
  }

  _renderDescr() {
    return new Padding(
      padding: EdgeInsets.only(top: 10, bottom: 10),
      child: new Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          new Text(
            '课程简介',
            style: TextStyle(
                fontFamily: "font1", fontSize: AppSize.getRealSp(25.0)),
          ),
          new Padding(padding: EdgeInsets.all(5)),
          new Text(
            '本课程从最基本的概念开始讲起，步步深入，带领大家学习HTML、CSS样式基础知识，了解各种常用标签的意义以及基本用法，后半部分教程主要讲解CSS样式代码添加，为后面的案例课程打下基础。',
            style: AppConstant.smallText,
          ),
        ],
      ),
    );
  }

  _renderStatus() {
    return new Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: <Widget>[
        new Container(
          color: Color(AppColors.Grey),
          height: 1,
        ),
        new Padding(padding: EdgeInsets.all(5)),
        new Text(
          '已预约11/20',
          style: AppConstant.middleTextBold,
        ),
        new Padding(padding: EdgeInsets.all(5)),
        new Container(
          color: Color(AppColors.Grey),
          height: 1,
        ),
        new Padding(padding: EdgeInsets.all(5)),
        new Row(
          children: <Widget>[
            new Container(
              child: new Text(
                '单价',
                style: AppConstant.middleTextBold,
              ),
              width: AppSize.getRealWidth(40),
            ),
            new Text(
              '100/节',
              style: AppConstant.middleSubTextBold,
            )
          ],
        ),
        new Padding(padding: EdgeInsets.all(3)),
        new Row(
          children: <Widget>[
            new Container(
              child: new Text(
                '时间',
                style: AppConstant.middleTextBold,
              ),
              width: AppSize.getRealWidth(40),
            ),
            new Text(
              '星期一 8:00-9:00',
              style: AppConstant.middleSubTextBold,
            )
          ],
        ),
        new Padding(padding: EdgeInsets.all(3)),
        new Row(
          children: <Widget>[
            new Container(
              child: new Text(
                '周期',
                style: AppConstant.middleTextBold,
              ),
              width: AppSize.getRealWidth(40),
            ),
            new Text(
              '8月-10月 ',
              style: AppConstant.middleSubTextBold,
            )
          ],
        ),
      ],
    );
  }

  _renderShop() {
    return new Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: <Widget>[
        new Padding(padding: EdgeInsets.all(5)),
        new Container(
          color: Color(AppColors.Grey),
          height: 1,
        ),
        new Padding(padding: EdgeInsets.all(3)),
        new Text(
          '开课门店',
          style: AppConstant.middleTextBold,
        ),
        new Padding(padding: EdgeInsets.all(3)),
        ShopItem(),
      ],
    );
  }

  _renderCoach() {
    return new Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: <Widget>[
        new Container(
          color: Color(AppColors.Grey),
          height: 1,
        ),
        new Padding(padding: EdgeInsets.all(3)),
        new Text(
          '开课教练',
          style: AppConstant.middleTextBold,
        ),
        new Padding(padding: EdgeInsets.all(3)),
        CoachItem()
      ],
    );
  }
}
